
import { useIntersectionObserver } from '@vueuse/core'
import { ref } from 'vue'
export const useObserver = (apiFn) => {
  // 数据懒加载
  // 绑定监控元素的ref
  // 反复监控
  const target = ref(null)
  const { stop } = useIntersectionObserver(
    target,
    ([{ isIntersecting }]) => {
      // console.log('进入视口啦')
      // 进入可视区后 发送请求
      if (isIntersecting) {
        apiFn()
        // 监控一次后就停止监控
        stop()
      }
    },
    {
      threshold: 0
    }
  )
  return { target }
}
